<template>
	<view class="content">
		 <view>
		
		 <view class="cu-form-group">
				<view class="title">活动名称</view>
				<input placeholder="活动名称" name="input" disabled :value="topic.title"></input>
			</view>
			
			<view class="cu-form-group">
				<view class="title">姓名</view>
				<input placeholder="请输入姓名" name="input" :value="name"  @input="inputChange" data-name="name"></input>
			</view>
			
			<view class="cu-form-group">
				<view class="title">手机号码</view>
				<input placeholder="请输入手机号码"  type="number" name="input" :value="phone"  @input="inputChange" data-name="phone"></input>
			</view>
			
		  <view class="cu-form-group">
				<view class="title">参与人数</view>
				<picker @change="PickerChangePeople" :value="number_of_people" :range="peoples">
					<view class="picker">
						{{number_of_people>-1?peoples[number_of_people]:'请选择参与人数'}}
					</view>
				</picker>
			</view>
			
			 
			
			<!-- !!!!! placeholder 在ios表现有偏移 建议使用 第一种样式 -->
			<!-- <view class="cu-form-group">
				<textarea maxlength="-1" :disabled="modalName!=null" @input="inputChange" data-name="visit_reason" placeholder="到访事由"></textarea>
			</view> -->
		
		  <view class="box margin-top-20" style=" padding: 20upx;">
			 
				<button @click="postForm" class="cu-btn block bg-blue margin-tb-sm lg">
				<text :class="loadding==1?'cuIcon-loading2 cuIconfont-spin':'cuIconfont-spin'"></text> 提交</button>
			 
			</view>
			
		 </view>
	</view>
</template>

<script>
	import beeApp from '../../beeApp.js'
	
	export default {
		data() {
			return {
				modalName: null,
				loadding:0,
				name:'',
				phone:'',
				peoples:["请选择人数","1人","2人","3人","4人","5人","6人","7人","8人","9人","10人"],
				content:'',
				number_of_people:-1,
				visit_date:'',
				user_info:{
					community:{
						
					}
				},
				topic:{
					
				}
			}
		},
		onLoad(option) {
		  this.topic_id = option.pid;
          // beeApp.alert("yiqwyei");
		  this.getUserInfo();
		  this.getTopic();
		  this.getEnter();
		},
		methods: {
			inputChange(e) {
				// console.log(e);
				var name = e.currentTarget.dataset.name;
				this[name] = e.detail.value
			},
			PickerChangePeople(e){
				 
				this.number_of_people = e.detail.value;
				
			},
			PickerChangeDate(e){
				this.visit_date = e.detail.value;
			},
			getUserInfo:function(){
                    var that = this;
                    beeApp.api("/api/user/info",{
                        fields:"user_id,store_id,phone,nickname,avatarUrl,last_update_time,community"
                    },function(res){
                         if(res.code==200){
                             that.user_info = res.data;
                         }
                        
                    });
                },
				getTopic:function(){
                    var that = this;
                    beeApp.api("sns/topic/detail",{
                        fields:"title,enter_ed",
						id:this.topic_id,
                    },function(res){
                         if(res.code==200){
                             that.topic = res.data;
                         }
                        
                    });
                },
				getEnter:function(){
                    var that = this;
                    beeApp.api("sns/topic_enter/find",{
						topic_id:this.topic_id,
                    },function(res){
                         if(res.code==200){
                             that.phone = res.data.phone;
							 that.name = res.data.name;
							 that.number_of_people = Number(res.data.number_of_people)-1
                         }
                        
                    });
                },
				postForm:function(){
				  var that = this;
				  if(that.loadding==1){
					  return;
				  }
				  if(this.name==""){
					  beeApp.alert("请输入姓名");
					  return;
				  }
				  if(this.phone==""){
					  beeApp.alert("请输入手机号");
					  return;
				  }
				  if(this.number_of_people==-1){
					  beeApp.alert("请选择人数");
					  return;
				  }
				  
				  that.loadding =1;
				   
				  beeApp.api("sns/topic_enter/add",{
					  topic_id:this.topic_id,
					  name:this.name,
					  phone:this.phone,
					  number_of_people:Number(this.number_of_people)+1,
					  status:1,
					  method:"POST",
				  },function(res){
					  that.loadding =0;
					 if(res.code!=200){
						beeApp.alert(res.msg);
						return ;
					 }
					beeApp.alert("恭喜您，报名成功！",function(){
						 beeApp.setPageData("pages/topic/detail",{reload:1});
						 uni.navigateBack();
						 
					})
				  });
				},
	}
		
}
</script>
